<script setup lang="ts">
const router = useRouter()

function handleViewOfficalAccount() {
  router.push('officalAccount')
}

function handleExit() {
  router.back()
}
</script>

<template>
  <view class="flex flex-col items-center">
    <Spacer height="210" />
    <image class="h-148rpx w-148rpx" src="@/static/images/calendar_fill.png" />
    <Spacer height="36" />
    <view class="text-40rpx leading-56rpx">
      预约成功
    </view>
    <Spacer height="12" />
    <view class="max-w-520rpx text-center text-28rpx text-#707070 leading-40rpx">
      预约就诊信息已提交，稍后将有工作人员与您确认就诊时间，请耐心等待。
    </view>
    <Spacer height="116" />
    <button class="h-100rpx w-356rpx flex items-center justify-center rounded-10rpx bg-#4999F7 text-32rpx text-white font-medium leading-45rpx" @tap="handleViewOfficalAccount">
      关注公众号
    </button>
    <Spacer height="20" />
    <button class="h-100rpx w-356rpx flex items-center justify-center rounded-10rpx bg-#F9F9F9 text-32rpx text-#707070 font-medium leading-45rpx" @tap="handleExit">
      返回首页
    </button>
  </view>
</template>

<route lang="yaml">
name: 'appointmentSuccess'
style:
  navigationBarTitleText: '预约成功'
layout: 'custom'
</route>
